<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<!-- Apple devices fullscreen -->
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- Apple devices fullscreen -->
    <style>
        .layui-imgbox{float: left;display: inline;width: 100px;height: 100px;margin-right: 12px;font-size: 12px;position: relative;}
        .layui-imgbox-close{position: absolute;display: block;width: 14px;height: 14px;right: -7px;top: -11px;color:#999}
        .layui-imgbox-img{display: block;width: 100%;height: 100%;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6}
        .layui-imgbox-img>img{max-width:100%;max-height:100%;cursor:pointer}

        .layui-search-admin{
            padding-bottom: 10px;
        }
         .layui-search-admin .layui-inline .layui-form-label{
             width: 60px;
         }
        .layui-search-admin .layui-inline .layui-input-inline{
            width: 120px;
        }
        .search-btn-div{
            text-align: right;
        }
        .open-edit-form{
            padding-left: 60px;
        }
        .layui-module-itemL,.layui-module-itemR{display: flex;align-items: center;width:auto !important;}
        .layui-module-itemL div{float: left;line-height: 20px;margin-right:0;background:#e6e6e6;padding: 9px 9px !important;}
        .layui-module-itemR div{float: left;line-height: 20px;margin-right:10px;background:#e6e6e6;padding: 9px 9px !important;}
        .layui-module-itemL input{width:100px;margin-right:10px;}
        .layui-module-itemR input{width:100px;}
        .layui-module-color{float: left;line-height: 20px;margin-right:0;background:#e6e6e6;padding: 9px 9px !important;}
        .layui-card-header .layui-icon {
            line-height: initial;
            position: absolute;
            right: 15px;
            top: 50%;
            margin-top: -7px;
        }
    </style>
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <script type="text/javascript" src="/static/design_page/jquery-2.1.4-min.js"></script>
    <script type="text/javascript" src="/static/design_page/jquery-ui/jquery-ui.min.js"></script>

    <script>
        if(localStorage.getItem("staticDomain")){
            document.write("<link rel='stylesheet' href='" + localStorage.getItem("staticDomain") + "/component/laytp/css/laytp.css?v=" + localStorage.getItem("version") + "'>");
            document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
            document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/laytp/layuiConfig.js?v="+localStorage.getItem("version")+"'><\/script>");
            document.write("<script src='" + localStorage.getItem("staticDomain") + "/static/old/js/global.js?v="+localStorage.getItem("version")+"'><\/script>");
        }else{
            document.write("<link rel='stylesheet' href='/static/component/laytp/css/laytp.css?v=" + localStorage.getItem("version") + "'>");
            document.write("<script src='/static/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
            document.write("<script src='/static/component/laytp/layuiConfig.js?v="+localStorage.getItem("version")+"'><\/script>");
            document.write("<script src='/static/webuploader/webuploader.js?v="+localStorage.getItem("version")+"'><\/script>");
            document.write("<script src='/static/old/js/global.js?v="+localStorage.getItem("version")+"'><\/script>");
            document.write("<link rel='stylesheet' href='/static/webuploader/webuploader.css?v=" + localStorage.getItem("version") + "'>");
        }
    </script>
    <script type="text/html" id="img-id">
        <img src="{{d.thumb}}" width="50" height="50" />
    </script>
    <script type="text/html" id="logo-id">
        <img src="{{d.logo}}" width="50" height="50" />
    </script>
    <script type="text/javascript">
        function date(format,timestamp){if(timestamp==null || timestamp=='') return '';var a,jsdate=((timestamp)?new Date(timestamp*1000):new Date());var pad=function(n,c){if((n=n+"").length<c){return new Array(++c-n.length).join("0")+n}else{return n}};var txt_weekdays=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];var txt_ordin={1:"st",2:"nd",3:"rd",21:"st",22:"nd",23:"rd",31:"st"};var txt_months=["","January","February","March","April","May","June","July","August","September","October","November","December"];var f={d:function(){return pad(f.j(),2)},D:function(){t=f.l();return t.substr(0,3)},j:function(){return jsdate.getDate()},l:function(){return txt_weekdays[f.w()]},N:function(){return f.w()+1},S:function(){return txt_ordin[f.j()]?txt_ordin[f.j()]:'th'},w:function(){return jsdate.getDay()},z:function(){return(jsdate-new Date(jsdate.getFullYear()+"/1/1"))/864e5>>0},W:function(){var a=f.z(),b=364+f.L()-a;var nd2,nd=(new Date(jsdate.getFullYear()+"/1/1").getDay()||7)-1;if(b<=2&&((jsdate.getDay()||7)-1)<=2-b){return 1}else{if(a<=2&&nd>=4&&a>=(6-nd)){nd2=new Date(jsdate.getFullYear()-1+"/12/31");return date("W",Math.round(nd2.getTime()/1000))}else{return(1+(nd<=3?((a+nd)/7):(a-(7-nd))/7)>>0)}}},F:function(){return txt_months[f.n()]},m:function(){return pad(f.n(),2)},M:function(){t=f.F();return t.substr(0,3)},n:function(){return jsdate.getMonth()+1},t:function(){var n;if((n=jsdate.getMonth()+1)==2){return 28+f.L()}else{if(n&1&&n<8||!(n&1)&&n>7){return 31}else{return 30}}},L:function(){var y=f.Y();return(!(y&3)&&(y%1e2||!(y%4e2)))?1:0},Y:function(){return jsdate.getFullYear()},y:function(){return(jsdate.getFullYear()+"").slice(2)},a:function(){return jsdate.getHours()>11?"pm":"am"},A:function(){return f.a().toUpperCase()},B:function(){var off=(jsdate.getTimezoneOffset()+60)*60;var theSeconds=(jsdate.getHours()*3600)+(jsdate.getMinutes()*60)+jsdate.getSeconds()+off;var beat=Math.floor(theSeconds/86.4);if(beat>1000)beat-=1000;if(beat<0)beat+=1000;if((String(beat)).length==1)beat="00"+beat;if((String(beat)).length==2)beat="0"+beat;return beat},g:function(){return jsdate.getHours()%12||12},G:function(){return jsdate.getHours()},h:function(){return pad(f.g(),2)},H:function(){return pad(jsdate.getHours(),2)},i:function(){return pad(jsdate.getMinutes(),2)},s:function(){return pad(jsdate.getSeconds(),2)},O:function(){var t=pad(Math.abs(jsdate.getTimezoneOffset()/60*100),4);if(jsdate.getTimezoneOffset()>0)t="-"+t;else t="+"+t;return t},P:function(){var O=f.O();return(O.substr(0,3)+":"+O.substr(3,2))},c:function(){return f.Y()+"-"+f.m()+"-"+f.d()+"T"+f.h()+":"+f.i()+":"+f.s()+f.P()},U:function(){return Math.round(jsdate.getTime()/1000)}};return format.replace(/[\\]?([a-zA-Z])/g,function(t,s){if(t!=s){ret=s}else if(f[s]){ret=f[s]()}else{ret=s}return ret})}

        function openmax(url){
            layer.open({title: ' ',type:2,content:url,area:['100%','100%'],scrollbar:false,shadeClose: true})
        }
        function openframe(url,title,width,height){
            layer.open({type:2,content:url,title:title,area:[width,height]})
        }
        function closeself(){
            parent.layer.close(parent.layer.getFrameIndex(window.name));
        }

        var qq_map_key = '{$qq_map_key}'
        /**
         * 全选
         * @param obj
         */
        function checkAllSign(obj){
            $(obj).toggleClass('trSelected');
            if($(obj).hasClass('trSelected')){
                $('#flexigrid > table>tbody >tr').addClass('trSelected');
            }else{
                $('#flexigrid > table>tbody >tr').removeClass('trSelected');
            }
        }

        /**
         * 批量公共操作（删，改）
         * @returns {boolean}
         */
        function publicHandleAll(type){
            var ids = '';
            $('#flexigrid .trSelected').each(function(i,o){
                ids += $(o).data('id')+',';
            });
            if(ids == ''){
                layer.msg('至少选择一项', {icon: 2, time: 2000});
                return false;
            }
            publicHandle(ids,type); //调用删除函数
        }
        /**
         * 公共操作（删，改）
         * @param type
         * @returns {boolean}
         */
        function publicHandle(ids,handle_type) {
            layer.confirm('确认当前操作？', {
                    btn: ['确定', '取消'] //按钮
                }, function () {
                    // 确定
                    $.ajax({
                        url: $('#flexigrid').data('url'),
                        type: 'post',
                        data: {ids: ids, type: handle_type},
                        dataType: 'JSON',
                        success: function (data) {
                            layer.closeAll();
                            if (data.status == 1) {
                                layer.msg(data.msg, {icon: 1, time: 2000}, function () {
                                    location.href = data.url;
                                });
                            } else {
                                layer.msg(data.msg, {icon: 2, time: 2000});
                            }
                        }
                    });
                }, function (index) {
                    layer.close(index);
                }
            );
        }

    </script>
    <div id="NewsToolBox"></div>
    <script type="text/javascript">
        // 浮层展示
        $('.layui-popover').mouseenter(function(){
            let pageHeight = $(window).height() + $(document).scrollTop();
            let bottom = pageHeight - $(this).offset().top
            let topNum = ($(this).offset().top - $(document).scrollTop()).toFixed(2);
            let Height = $(this).find('.layui-popover-div').outerHeight();
            $(this).find('.layui-popover-div').show()
            let that = this;
            setTimeout(function(){
                if(topNum < (Height/2-15)){
                    $(that).find('.layui-popover-div').css({'top':-topNum+10+'px','opacity':1,'transition':'opacity .3s'})
                }else if(bottom < (Height/2-15)){
                    $(that).find('.layui-popover-div').css({'top': bottom-Height-10 +'px','opacity':1,'transition':'opacity .3s'})
                }else{
                    $(that).find('.layui-popover-div').css({'top':-(Height/2-15)+'px','opacity':1,'transition':'opacity .3s'})
                }
            },100)
        })
        $('.layui-popover').mouseleave(function(){
            $(this).find('.layui-popover-div').css({'opacity':0})
            $(this).find('.layui-popover-div').hide()
        })
        function copyText(text) {
            var top = document.documentElement.scrollTop;
            var textarea = document.createElement("textarea"); //创建input对象
            var currentFocus = document.activeElement; //当前获得焦点的元素
            var toolBoxwrap = document.getElementById('NewsToolBox'); //将文本框插入到NewsToolBox这个之后
            toolBoxwrap.appendChild(textarea); //添加元素
            textarea.value = text;
            textarea.focus();
            document.documentElement.scrollTop = top;
            if (textarea.setSelectionRange) {
                textarea.setSelectionRange(0, textarea.value.length); //获取光标起始位置到结束位置
            } else {
                textarea.select();
            }
            try {
                var flag = document.execCommand("copy"); //执行复制
            } catch (eo) {
                var flag = false;
            }
            toolBoxwrap.removeChild(textarea); //删除元素
            currentFocus.focus();
            if(flag) layer.msg('复制成功');
            return flag;
        }
        // 查看链接
        function viewLink(path,url=''){
            var pagepath = path;
            if(!url){
                var url = "{:m_url('"+pagepath+"')}"; //拼接 H5 链接
            }

            var html = '';
            html+='<div style="margin:20px">';
            html+='	<div style="width:100%;margin:10px 0" id="urlqr"></div>';

            html+='	<div style="width:100%;text-align:center"><button class="layui-btn layui-btn-sm layui-btn-primary" onclick="showwxqrcode(\''+pagepath+'\')">查看小程序码</button></div>';

                html+='	<div style="line-height:25px;"><div><span style="width: 70px;display: inline-block;">链接地址：</span><button class="layui-btn layui-btn-xs layui-btn-primary" onclick="copyText(\''+url+'\')">复制</button></div><div>'+url+'</div></div>';
                html+='	<div style="height:50px;line-height:25px;"><div><span style="width: 70px;display: inline-block;">页面路径：</span><button style="box-sizing: border-box;" class="layui-btn layui-btn-xs layui-btn-primary" onclick="copyText(\'/'+pagepath+'\')">复制</button></div><div>/'+pagepath+'</div></div>';
                html+='</div>';
                layer.open({type:1,'title':'查看链接',area:['500px','430px'],shadeClose:true,'content':html})
                var qrcode = new QRCode('urlqr', {
                    text: 'your content',
                    width: 200,
                    height: 200,
                    colorDark : '#000000',
                    colorLight : '#ffffff',
                    correctLevel : QRCode.CorrectLevel.L
                });
                qrcode.clear();
                qrcode.makeCode(url);
            }
            // 查看小程序码
        function showwxqrcode(pagepath){
                var index = layer.load();
                $.post("{:url('DesignerPage/getwxqrcode')}",{path:pagepath},function(res){
                    layer.close(index);
                    if(res.status==0){
                        layer.open({type:1,area:['300px','350px'],content:'<div style="margin:auto auto;text-align:center"><div style="color:red;width:280px;height:180px;margin-top:100px">'+res.msg+'</div><div style="height:25px;line-height:25px;">'+pagepath+'</div></div>',title:false,shadeClose:true})
                    }else{
                        layer.open({type:1,area:['300px','350px'],content:'<div style="margin:auto auto;text-align:center"><img src="'+res.url+'" style="margin-top:20px;max-width:280px;max-height:280px"/><div style="height:25px;line-height:25px;">'+pagepath+'</div></div>',title:false,shadeClose:true})
                    }
                })
            }

        //颜色选择器
        layui.use(function (){
        function initcolorpicker(){
            if($('._colorpicker').length > 0){
                $('._colorpicker').each(function(){
                    var $this = $(this);
                    var _colorpickerId = $this.attr('id') ? $this.attr('id') : "_colorpicker" + (Date.now()) + parseInt(Math.random()*100000000);
                    $this.attr('id',_colorpickerId);
                    var input = $this.parent().find('input');
                    console.log(input.val())

                        layui.colorpicker.render({
                            elem: '#'+_colorpickerId,
                            format:($this.attr('coloralpha')=='1'? 'rgb':'hex'),
                            alpha: ($this.attr('coloralpha')=='1'? true:false),
                            color: (input && input.val() ? input.val() : "#FFFFFF"),
                            predefine: true,
                            colors: ['#ff4444','#e64340','#ec8b89','#ed3f14','#ff9900',
                                '#06bf04','#179b16','#9ed99d','#19be6b',
                                '#3388ff','#2b85e4','#5cadff',
                                '#000000','#333333','#666666','#999999','#c9c9c9','#f7f7f8','#1c2438','#495060','#dddee1','#e9eaec'],
                            change:function(color){
                                //ctrl.$setViewValue(color);
                                if($this.attr('coloralpha')!='1') color = color.toUpperCase()
                                input && input.val(color);
                                //input && input.change();
                            }
                        });


                })
            }
        }
            initcolorpicker();
        })

    </script>

    <!-------使用js导出excel文件--------->
    <script src="/static/admin/excel/excel.js"></script>
    <script src="/static/admin/excel/layui_exts/excel.js"></script>
    <script>

        var excel = new Excel();
        var excel_name = '{$excel_name}';
        excel.bind(function (data,title) {
            var excel_field = {$excel_field};
            if(title && title!=undefined){
                //接口返回的title
                var excel_title = title;
            }else{
                //excel_field.php 配置的title
                var excel_title = {$excel_title};
            }
            if(!excel_title || excel_title.length<=0){
                //上面两种都没有title,读取table表格cols中的title，同时filed也更新为table表格cols中的field
                excel_title = [];
                excel_field = [];
                var cols = tableIns.config.cols;
                cols.forEach(function (cols_item, cols_index) {
                    console.log(cols_item);
                    cols_item.forEach(function (cols_item2, cols_index2) {
                        console.log(cols_item2);
                        if(cols_item2.title){
                            excel_title.push(cols_item2.title)
                            excel_field.push(cols_item2.field)
                        }
                    })
                })
            }
            // if(!excel_title || excel_title.length<=0){
            //     layer.msg('未设置标题');
            //     return;
            // }

            // 设置表格内容
            data.forEach(function (item, index) {
                var _data = [];
                excel_title.forEach(function (title, index2) {
                    var field = excel_field[index2];
                    if(item[field] && item[field]!=undefined){
                        //有filed 匹配field
                        var field_val = item[field];
                        //是整数 长度为10 字段名包含time 判定为时间戳
                        if(parseInt(field_val) == field_val && (field_val.toString()).length==10 && field.includes('time')){
                            field_val = date('Y-m-d H:i:s',field_val);
                        }
                    }else{
                        //没有filed 根据顺序来
                        var field_val = item[index2];
                    }
                    _data.push(field_val);
                })
                data[index] = _data;
            });
            // 设置表头内容
            if(excel_title && excel_title.length>0){
                data.unshift(excel_title);
            }
            // 应用表格样式
            return this.withStyle(data);

        }, excel_name+layui.util.toDateString(Date.now(), '_yyyyMMdd_HHmmss'));

    </script>

</head>